<template>
  <Tabs v-model:activeKey="activeKey">
    <TabPane v-if="checkPowerByName('vpcInfo')" key="1" tab="VPC信息">
      <VpcBasicTable :columns="vpcColumns" :function="getVpcList" />
    </TabPane>
    <TabPane v-if="checkPowerByName('subnetInfo')" key="2" tab="子网信息">
      <VpcBasicTable :columns="subnetColumns" :function="getSubnetList" />
    </TabPane>
    <TabPane v-if="checkPowerByName('securityGroupInfo')" key="3" tab="安全组信息">
      <VpcBasicTable :columns="securityGroupColumns" :function="getSecurityGroupList" />
    </TabPane>
  </Tabs>
</template>
<script lang="ts" setup>
import { ref } from 'vue';
import { Tabs, TabPane } from 'ant-design-vue';
import { getVpcList, getSubnetList, getSecurityGroupList } from '/@/api/system-mgmt/vpcInfo-mgmt/vpcInfo';
import VpcBasicTable from '/@/views/system-mgmt/vpc-mgmt/vpcBasicTable.vue';
import { vpcColumns, subnetColumns, securityGroupColumns } from '/@/views/system-mgmt/vpc-mgmt/data';
import { checkPowerByName } from '../../../utils/permission';

const activeKey = ref('1');
</script>
